﻿@model thailandProject.Models.Pair<thailandProject.Models.Triplet<int, int, string>, List<thailandProject.Models.TASKTYPE>>

@{
    ViewBag.Title = "View Client";
}


<div id="Wrapper2">
    <div id="content_header">
        <div id="headerimage">
        </div>
        <div id="theheader">@ViewBag.Header</div>
    </div>
    <!-- Left Column begins here -->
    <aside id="sidebar-wrapper">
        <nav class="sidebar">
            <!-- CONTENT GOES HERE -->
            @using (Html.BeginForm("AddClientTask", "Clients", FormMethod.Post, new { id = "taskForm" }))
            {
                <div id="taskNameArea">
                    <div class="display-label">Task Name</div>
                    <div class="display-field">
                        <input type="text" id="taskName" name="taskName" maxlength="100" />
                    </div>
                    <div id="taskNameError" style="color:red; visibility:hidden">Task name must not be empty</div>

                    <div class="display-label">Due Date</div>
                    <div class="display-field">
                        <input type="text" id="taskDueDate" class="datepicker" name="taskDueDate" value="@Model.value1.value3" readonly="true" />
                    </div>

                    <div class="display-label">Task Type</div>
                    <div class="display-field">
                        <select id="taskTypeDrop" name="taskTypeId">
                            @foreach (var tt in Model.value2)
                            {
                                <option value="@tt.taskTypeID">@tt.taskTypeName</option>
                            }
                        </select>
                    </div>
                    <div class="display-label">Task Time</div>
                    <div class="display-field">
                        <select id="taskTypeHour" name="taskTypeHour">
                            @for (int i = 1; i < 13; i++)
                            {
                                <option value="@i">@i</option>
                            }
                        </select>
                        <select id="taskTypeMinute" name="taskTypeMinute">
                            @for (int i = 0; i < 60; i++)
                            {
                                <option value="@i">@(i < 10 ? "0" + i : i + "")</option>
                            }
                        </select>
                        <select id="taskTypeMeridian" name="taskTypeMeridian">
                            <option value="AM">AM</option>
                            <option value="PM">PM</option>
                        </select>
                    </div>
                </div>

                <div id="taskDetailsArea">
                    <div class="display-label">Details</div>
                    <div class="display-field">
                        <textarea id="taskDetailBox" name="taskDetails" ></textarea>
                    </div>
                    <div id="charsLeft">&nbsp;</div>
                    <input type="hidden" name="clientId" value="@Model.value1.value1" />
                    <input type="hidden" name="resId" value="@Model.value1.value2" />
                </div>
                <div style="width:100%; float:left; margin:10px 0px 10px 0px;">
                    <input type="image" src="../../images/add_button.png" id="addTaskButton" value="Add Task" />
                    <div id="formError" style="color:red; visibility:hidden">Please fix the above errors to continue</div>
                    <input type="hidden" id="formcheck" value="false" />
                </div>
            }
            
            @Html.ActionLink("Back", "ViewClient", new { ClientId = Model.value1.value1 })
        </nav>
    </aside>
    <!-- Right column begins here -->
    <article id="contents">
        
    </article>
    <!-- Right column ends here -->
</div>
<!-- Div wrapper2 ends here -->


<script type = "text/javascript">
    $(function () {
        var date = $("#taskDueDate").val();
        var month = parseInt(date.substr(0, date.indexOf('/')));
        var day = parseInt(date.substr(date.indexOf('/') + 1, date.lastIndexOf('/')));
        var year = parseInt(date.substr(date.lastIndexOf('/') + 1, 4));

        $(".datepicker").datepicker({ minDate: new Date(year, month - 1, day) });
    });

    $("#taskForm").submit(function() {
        //Check to make sure the task name has something in it
        if ($("#taskName").val() == "") {
            $("#taskNameError").attr('style', 'color:red; visibility:visible');
            $("#formError").attr('style', 'color:red; visibility:visible');
            $("#taskName").focus();
            return false;
        }
        else {
            $("#taskNameError").attr('style', 'color:red; visibility:hidden');
            $("#formError").attr('style', 'color:red; visibility:hidden');

            if ($("#formcheck").val() == 'false') {
                $("#formcheck").val('true');
                return true;
            }
            else {
                alert('Your action is currently being processed. Please wait');
                return false;
            }
        }
    })

    $("#taskDetailBox").keyup(function() {
        //Update the chars remaining box
        var message = $(this).val();

        if (message.length > 2000) {
            message = message.substr(0, 2000);
            $(this).val(message);
        }

        $("#charsLeft").text(2000 - message.length + " chars left");
    })
</script>